<script setup lang="ts">
import router from '@/router';
import { useQuestionStore } from '@/stores/question';
import { computed, ref } from 'vue';

const store = useQuestionStore()

const allowToGo = ref(false)

const description = computed(() => {
  if(store.total == 0) {
    return "一道错题都没找到，你太厉害了！"
  } else {
    allowToGo.value = true
    return "找到" + store.total + "道错题，加油复习！"
  }
});

const handleBack = () => {
  router.push({ path: '/'})
}

const handleNext = () => {
  router.push({ path: '/question'})
}

</script>

<template>
  <el-main class="wrapper">
    <p class="description-textbox"> {{ description }}</p>
    <el-button @click="handleBack">重新上传</el-button>
    <el-button @click="handleNext" :disabled="!allowToGo">Gogogo!</el-button>
  </el-main>
</template>

<style scoped>
  .wrapper {
    text-align: center;
  }

  .description-textbox {
    min-height: 3rem;
    text-align: center;
  }
</style>